<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>模糊搜索</title>
    <style>
        *,
        *::after,
        *::before {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        :root {
            min-height: 100vh;
        }

        :root:focus-within {
            scroll-behavior: smooth;
        }

        body {
            min-height: inherit;
        }
    </style>
</head>

<body>
    <div></div>
</body>
<script>
    "use strict"; {
        /* 
        list 原数组
        keyWord 查询的关键词
        attribute 数组需要检索属性
        */
        const fuzzyQuery = (list, keyWord, attribute = 'name') => {
            const reg = new RegExp(keyWord)
            const arr = []
            for (let i = 0; i < list.length; i++) {
                if (reg.test(list[i][attribute])) {
                    arr.push(list[i])
                }
            }
            return arr
        }


        const list = [
            { id: 1, name: '树哥' },
            { id: 2, name: '黄老爷' },
            { id: 3, name: '张麻子' },
            { id: 4, name: '汤师爷' },
            { id: 5, name: '胡万' },
            { id: 6, name: '花姐' },
            { id: 7, name: '小梅' }
        ]
        fuzzyQuery(list, '树', 'name') // [{id: 1, name: '树哥'}]
    };
</script>

</html>